import * as React from 'react';
import * as ReactDOM from 'react-dom';
import * as Global from '../TS/Global';
import * as Mycss from "../CSS/mycss.css";
import * as MyCfg from './MyCfg';

export interface LoadingProps extends Global.Myprops {
    ShowText?: string;
    IsShow?: boolean;
};

interface LoadingState {
    ShowText : string;
    IsShow : boolean;
};

export class Loading extends React.Component < LoadingProps,
LoadingState > {
    constructor(props) {
        super(props);
        //设置状态
        this.state = {
            ShowText: props.ShowText
                ? props.ShowText
                : "加载中...",
            IsShow: props.IsShow != undefined
                ? props.IsShow
                : false
        };

    }
    //用于处理收到的数据
    ReciveMsgEvent(source : any, cmd : string, obj?: any, ...args) {
        if (cmd == 'show') {
            this.setState({IsShow: true});
        } else if (cmd == 'close') {
            this.setState({IsShow: false});
        } else if (cmd == 'ShowText') {
            this.setState({ShowText: obj, IsShow: true});
        }
    }

    //下一步进行显示 进行初始化
    componentDidMount() {
        //类似window.onload
        this.setState((prv, prop) => ({
            // count: this.state.count + 1
        }));
    }
    componentWillReceiveProps(nextProps)
    {
        //每次父控件重新绘制,赋值新的props触发
        this.setState({});
    }
    public handleClick(e : React.MouseEvent < any >) : void {}
    public handleChange(event : any) : void {

        console.log(event.target.value);
    }
    public render() : JSX.Element {return(
            <div
                id="loading"
                className={this.state.IsShow
                ? Mycss.loading
                : Mycss.Hidden}>
                <div
                    className={Mycss.Center_flex}
                    style={{
                    color: '#000000',
                    'font-weight': 'bold',
                    'font-size': '25px'
                }}>{this.state.ShowText}</div>
            </div>
        );}
}